$(function () {
  /*$("#jqxWidget").jqxCalendar({
    width: 220, height: 220,
    min: new Date(),
    culture: 'zh-CN'
  });*/
  var midWrap = $('.cron .mid');
  var btmWrap = $('.cron .bottom');
  var currentType = 'none';
  var selectInstance = new Select({
    el: $('.modes .types .hero-select')[0]
  });

  selectInstance.on('change', function (val) {
    if (currentType !== val.value) {
      currentType = val.value;
      midWrap.find('.mid-item').addClass('none');
      midWrap.find('.' + currentType).removeClass('none');
      changeMode(currentType);
    }
  });

  btmWrap.find('button').click(function () {
    console.log('click');
  });

// <b>not scheduled</b>
  // hourly change
  $('.cron .hour-control input').on('input', function () {
    var val = Number($(this).val());
    if (val >= 0) {
      setHourText(val);
    }
  });

  // day change
  $('.cron .day-control input').on('input', function () {
    setDayText($(this).val());
  });

  // week change
  var weeksLi = midWrap.find('.week li');
  var selectedWeek = moment().day();
  var weekTime = moment().format("HH:mm");
  var weekLabels = ['日', '一', '二', '三', '四', '五', '六'];
  weeksLi.click(function () {
    var index = $(this).index();
    if (selectedWeek !== index) {
      selectedWeek = index;
      weeksLi.removeClass('selected');
      $(this).addClass('selected');
      setWeekText();
    }
  });
  $('.cron .week-control input').on('input', function () {
    weekTime = $(this).val();
    setWeekText();
  });

  function changeMode(mode) {
    switch (mode) {
      case 'hour':
          btmWrap.find('button').removeClass('disabled');
          var hour = moment().minute();
          $('.cron .hour-control input').val(hour);
          setHourText(hour);
        break;
        case 'day':
          var dayTime = moment().format("HH:mm");
          btmWrap.find('button').removeClass('disabled');
          $('.cron .day-control input').val(dayTime);
          setDayText(dayTime);
        break;
        case 'week':
          weekTime = moment().format("HH:mm");
          // 0 === 周日
          selectedWeek = moment().day();
          weeksLi.removeClass('selected');
          weeksLi.eq(selectedWeek).addClass('selected');
          btmWrap.find('button').removeClass('disabled');
          $('.cron .week-control input').val(weekTime);
          setWeekText();
        break;
      default:
          btmWrap.find('button').addClass('disabled');
          setDefText();
        break;
    }
  }


  function setDefText() {
    var html = 'Your extractor is <b>not scheduled</b> to run.'
    btmWrap.find('.result-tip').html(html);
  }
  function setHourText(text) {
    var html = 'Your extractor will run at <b>'+ text +'</b> minutes past the hour.'
    btmWrap.find('.result-tip').html(html);
  }
  function setDayText(text) {
    var html = 'Your extractor will run <b>daily</b> at '+ text +'.';
    btmWrap.find('.result-tip').html(html);
  }
  function setWeekText() {
    var label = '周' + weekLabels[selectedWeek];
    var html = 'Your extractor will run <b>weekly</b> on <b>'+ label +'</b> at '+ weekTime +'.';
    btmWrap.find('.result-tip').html(html);
  }
});